<template>
  <div class="gov-application-materials">
    <div class="table">
      <el-table :data="tableData" ref="multipleTable" style="width: 100%" @selection-change="handleSelectionChange">
        <el-table-column type="selection" width="55" v-if="handleType !== 'scan'"></el-table-column>
        <!-- <el-table-column type="index" width="50"></el-table-column>
        <el-table-column prop="date" show-overflow-tooltip label="办理名称"></el-table-column> -->
        <el-table-column prop="handleAddressDetail" show-overflow-tooltip label="办理地址"></el-table-column>
        <!-- <el-table-column prop="date" show-overflow-tooltip label="办理时间"></el-table-column> -->
      </el-table>
    </div>
  </div>
</template>

<script>
  import axios from 'axios';
  export default {
    components: {},
    props: {
      // clone克隆、edit编辑、scan查看
      handleType: {
        type: String
      },
      selected: {
        type: Object,
        default: () => {
          return {};
        }
      }
    },
    data() {
      return {
        multipleSelection: [],
        tableData: []
      };
    },
    watch: {},
    computed: {},
    methods: {
      handleSelectionChange(val) {
        this.multipleSelection = val;
      },
      async getTableData() {
        const { data } = await axios.request({
          url: '/api/v1/event/handle-address/list',
          method: 'get'
        });
        this.tableData = data.result;

        this.$nextTick(() => {
          if (this.selected) {
            const list = this.selected.ids || [];
            const row = [];
            this.tableData.forEach((e) => {
              if (list.indexOf(e.handleAddressId) > -1) {
                this.$refs.multipleTable.toggleRowSelection(e);
              }
            });
          }
        });
      },
      // 获取form数据,isValid是否需要验证，暂存不验证，提交验证
      getFormData(isValid) {
        // 验证
        let valid = true;
        const ids = [];

        if (isValid && this.multipleSelection.length === 0) {
          valid = false;
        } else {
          this.multipleSelection.forEach((e) => {
            ids.push(e.handleAddressId);
          });
        }

        return {
          valid,
          data: {
            ids
          }
        };
      }
    },
    created() {},
    mounted() {
      this.getTableData();
    }
  };
</script>
<style lang="scss">
  .gov-application-materials {
    .header {
      margin-bottom: 20px;
    }
  }
</style>
